import './assets/main.css'

import { createApp } from 'vue'
import App from './App.vue'
import App2 from './App2.vue'
import RouteDemo from './RouteDemo.vue'
import StoreDemo from './StoreDemo.vue'
import HomePage from './pages/HomePage.vue'
import WorkPage from './pages/WorkPage.vue'
import UserCenter from './pages/UserCenter.vue'
import UserDetail from './pages/UserDetail.vue'
import UserDetail2 from './pages/UserDetail2.vue'

import {createRouter,createWebHashHistory} from 'vue-router'


//1.创建路由规则
 const routes=[
    {path:"/Home",component:HomePage},
    {path:"/Work",component:WorkPage},
    {path:"/User",component:UserCenter,name:"UserPage" ,
        children:[
        {
            path:'1/:id',
            component:UserDetail,
            props:true
        },
        {
            path:'2',
            component:UserDetail2
        }
    ]},
 ]

//2.创建路由器
const router = createRouter({
    history:createWebHashHistory(),//路由工作模式
    routes
})

//3.加载路由规则
const app = createApp(RouteDemo)
app.use(router)

//pinia
import { createPinia } from 'pinia'
import path from 'path'
const pinia = createPinia()
app.use(pinia)

app.mount('#app')
